import 'package:flutter/material.dart';
import 'package:flutter_api/widgets/title_text_container.dart';

// 开关、单选、多选按钮
class SwitchRadioCheckButtonPage extends StatefulWidget {
  @override
  _SwitchRadioCheckButtonPageState createState() =>
      _SwitchRadioCheckButtonPageState();
}

class _SwitchRadioCheckButtonPageState
    extends State<SwitchRadioCheckButtonPage> {
  bool _switch = false;
  bool _cbSelected = false;
  String _radioValue = "op1";
  int _sexValue = 1;

  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.all(12.0),
      child: ListView(
        children: [
          TitleTextContainer('普通Switch开关',
              child: Switch(
                value: _switch,
                onChanged: (value) {
                  setState(() {
                    _switch = value;
                  });
                },
              )),
          TitleTextContainer('带描述的Switch',
              child: SwitchListTile(
                value: _switch,
                title: Text('开启加固'),
                subtitle: Text('加固后App更安全'),
                secondary: Icon(Icons.build),
                onChanged: (value) {
                  setState(() {
                    _switch = value;
                  });
                },
              )),
          TitleTextContainer(
            '普通多选',
            child: Checkbox(
              value: _cbSelected,
              onChanged: (value) {
                setState(() {
                  _cbSelected = value;
                });
              },
            ),
          ),
          TitleTextContainer(
            '单选按钮',
            child: Row(
              children: [
                Text('当前Radio组Value=$_radioValue'),
                // Radio数组为互斥关系
                Radio(
                    activeColor: Colors.redAccent,
                    value: 'op1',
                    groupValue: _radioValue,
                    onChanged: (value) {
                      setState(() {
                        _radioValue = value;
                      });
                    }),
                Radio(
                    activeColor: Colors.redAccent,
                    value: 'op2',
                    groupValue: _radioValue,
                    onChanged: (value) {
                      setState(() {
                        _radioValue = value;
                      });
                    }),
              ],
            ),
          ),
          TitleTextContainer(
            '带描述的单选按钮',
            child: Column(
              children: [
                Text('SexValue=$_sexValue'),
                // Radio数组为互斥关系
                RadioListTile(
                    value: 1,
                    title: Text('同意'),
                    secondary: Text('同意则继续使用'),
                    //选中后，改变radio和文本
                    selected: this._sexValue == 1,
                    groupValue: this._sexValue,
                    onChanged: (value) {
                      setState(() {
                        _sexValue = value;
                      });
                    }),
                RadioListTile(
                    value: 2,
                    title: Text('拒绝'),
                    secondary: Text('拒绝后退出应用'),
                    selected: this._sexValue == 2,
                    groupValue: this._sexValue,
                    onChanged: (value) {
                      setState(() {
                        _sexValue = value;
                      });
                    }),
              ],
            ),
          )
        ],
      ),
    );
  }
}
